﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true"
    CodeBehind="signup.aspx.cs" Inherits="Touch2Like.Web.Customer.signup" %>

<asp:Content ID="Content1" ContentPlaceHolderID="headcontent" runat="server">
    <script type="text/javascript">
        $(function () {
            $(".tb_Email").keyup(function(){
                if($.trim($(this).val())=="")$("#tb_Email_Validate").css("display","inline");
                else $("#tb_Email_Validate").css("display","none");
            });
            $(".tb_Password").keyup(function () {
                var pwd = $(this).val();
                weak = false;
                good = false;
                strong = false;
                if(pwd.length<6)
                weak=true;
                else if(/[a-zA-Z]+/.test(pwd)&&/[0-9]+/.test(pwd)&&/[-`=\\\[\];',./~!@#$%^&*()_+|{}:"<>?]+/.test(pwd))
                  strong=true;
                else if(/[a-zA-Z]+/.test(pwd)&&/[0-9]+/.test(pwd))
                  good=true;
                else if(/[a-zA-Z]+/.test(pwd)&&/[-`=\\\[\];',./~!@#$%^&*()_+|{}:"<>?]+/.test(pwd))
                  good=true;
                else weak=true;

                $("#lb_Password_Validate").find(".weak,.good,.strong").css("color","#8C8C8C").css("background","#dddddd");
                if(weak)$("#lb_Password_Validate .weak").css("color","red").css("background","#F2DEDE");
                else if(good)$("#lb_Password_Validate .good").css("color","red").css("background","#F2DEDE");
                else if(strong)$("#lb_Password_Validate .strong").css("color","red").css("background","#F2DEDE");
            });
        });
    </script>
    <style type="text/css">
        .labelleft
        {
            float: left;
            width: 159px;
            padding-right: 20px;
        }
        .inputright
        {
            float: left;
            padding-right: 20px;
        }
        .controlline
        {
            float: none;
            padding-bottom: 10px;
        }
        .clear
        {
            clear:both;
            height:0px;
            line-height:0px;
        }
        label, input, button, select, textarea, input[type="text"] ,input[type="password"]
        {
            height:auto;
            line-height:normal;
            width:250px !important;
            margin-bottom:0px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="maincontent" runat="server">
    <section id="header-btm" class="clearfix">
        <div class="container">
        <div class="row">
            <div class="span12">
            <h4 class="heading-icon clearfix"> <img src="/img/icons/heading-icon-user.png" width="40" height="40" alt="icon" class="icon-small-bg">Create a free account</h4>
            </div>
        </div>
        </div>
    </section>
    <div id="header_bottom" style="padding-bottom:30px">
        <div class="container clearfix">
            <asp:PlaceHolder ID="PH_Signup" runat="server">
                <div style="width: 750px; margin: 0 auto;">
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                First Name</span>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_FirstName" runat="server" Width="250px"></asp:TextBox></p>
                        <p class="inputright">
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="First name is required"
                                ControlToValidate="tb_FirstName"></asp:RequiredFieldValidator>
                        </p>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                Last Name</span>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_LastName" runat="server" Width="250px"></asp:TextBox></p>
                        <p class="inputright">
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="Last name is required"
                                ControlToValidate="tb_LastName"></asp:RequiredFieldValidator>
                        </p>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                Username</span>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_Username" runat="server" Width="250px"></asp:TextBox></p>
                        <p class="inputright">
                            <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="Username is required"
                                ControlToValidate="tb_Username"></asp:RequiredFieldValidator>
                        </p>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                Email</span>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_Email" runat="server" Width="250px" CssClass="tb_Email"></asp:TextBox></p>
                        <p class="inputright">
                            <span style="color: Red; display: none;" id="tb_Email_Validate">Email is required</span>
                            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="Invalid email"
                                ControlToValidate="tb_Email" ValidationExpression="^[a-zA-Z][\w\.]+@\w+\.\w+$"></asp:RegularExpressionValidator></p>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline" style="padding-bottom:0px; margin-bottom:0px;">
                        <p class="labelleft" style="padding-bottom:0px; margin-bottom:0px;">
                            <span>
                                Password</span>
                        </p>
                        <p class="inputright" style="padding-bottom:0px; margin-bottom:0px;">
                            <asp:TextBox ID="tb_Password" runat="server" Width="250px" TextMode="Password" CssClass="tb_Password"></asp:TextBox></p>
                        <div class="inputright" style="padding-bottom:0px; margin-bottom:0px;">
                            <div>
                                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="Password is required"
                                    ControlToValidate="tb_Password"></asp:RequiredFieldValidator>
                            </div>
                        </div>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                &nbsp;</span></p>
                        <div class="inputright">
                            <div>
                                <span id="lb_Password_Validate"><span style="display: inline-block; padding: 3px;
                                    margin: 0px 1px; background: #dddddd;" class="weak">weak</span><span style="display: inline-block;
                                        padding: 3px; margin: 0px 1px; background: #dddddd;" class="good">good</span><span
                                            style="display: inline-block; padding: 3px; margin: 0px 1px; background: #dddddd;"
                                            class="strong">strong </span></span>
                            </div>
                        </div>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <span>
                                Confirm Password
                            </span>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_Password1" runat="server" Width="250px" TextMode="Password"></asp:TextBox></p>
                        <p class="inputright">
                            <asp:CompareValidator ID="CompareValidator1" runat="server" ControlToCompare="tb_Password"
                                ControlToValidate="tb_Password1" ErrorMessage="Confirm password is error"></asp:CompareValidator></p>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                        <p class="labelleft">
                            <label>
                                Registration Code</label>
                        </p>
                        <p class="inputright">
                            <asp:TextBox ID="tb_AcCode" runat="server" Width="250px"></asp:TextBox></p>
                        <p class="inputright">
                            <span style="color:Gray; display:inline" id="Span1">(Optional)</span>
                        <div class="clear">
                        </div>
                    </div>
                    <div class="controlline">
                                            <p class="labelleft">
                            <label>
                                &nbsp;</label></p>
                        <p class="inputright">
                            <asp:Button ID="btn_Signup" runat="server" Text="Create my account" CssClass="submit" Font-Size="Large"
                                OnClick="btn_Signup_Click" style="margin-left:0px" />&nbsp;<asp:Label ID="lb_Msg" runat="server" ForeColor="#BC4141"
                                    Font-Size="12px"></asp:Label></p>
                        <div class="clear">
                        </div>
                    </div>
                </div>
            </asp:PlaceHolder>
            <asp:PlaceHolder ID="PH_Success" runat="server" Visible="false">
                <div style="width: 550px; margin: 60px auto;">
                    <h3 style="color: #525F90;">
                        Your account is created, What do you want to do next?
                    </h3>
                    <br />
                    <br />
                    <div style="width: 280px; margin: 0 auto;">
                    <h3><span class="color"><a href="/Store.aspx">Shop Tags</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="/Customer/Index.aspx">Manage Tags</a></span></h1>
                        </div>
                </div>
            </asp:PlaceHolder>
            <asp:PlaceHolder ID="PH_SuccessToOrder" runat="server" Visible="false">
                <div style="width: 500px; margin: 60px auto;">
                    <h3 style="color: #525F90;">
                        Your account is created, please complete your order.
                        <div style="width: 350px; margin: 0 auto;">
                            If the browser can't redirect to the check out page, you can click this to <a href='/goods/CheckOut.aspx?OrderID=<%=Request["OrderID"] %>'>
                                Check Out</a>.
                        </div>
                    </h3>
                </div>
                <script type="text/javascript">
                    setTimeout(function () { document.location.href = '/goods/CheckOut.aspx?OrderID=<%=Request["OrderID"] %>'; }, 3000);
                </script>
            </asp:PlaceHolder>
        </div>
    </div>
</asp:Content>
